Hello and welcome to this lecture.
In this lecture we will be creating the functionality for our app using javascript.
So this this what the app looks like at the moment.
There is no functionality.
There is a word in there.
I click on this button here.
Nothing will happen because the Jabr scrip function has not been implement it.
So we're going to do that now.
So this is our blank javascript moment.
So what I'm going to do to save time.
I've already written the cuts I'm just going to pace in.
So this is our code that will create live functionality for our app.
I will just explain the code step by step plan one here.
I have declared a variable variable.
Basically it's a way of store in value in Javascript variable control list all one value at a time.
So I've created a variable in the world V are and I have called it print.
When you create variables you can also give it a value at the same time you create it.
So I'm giving the value here equal to function.
This function here has given the function takes in one argument or one parameter which is m s chief.
So does this what is m s t.
Here is the word that someone will tie a pencil.
This is a function argument.
So when you create a variable you can make.
You can let your King set the value.
Took the squaw's to a function as well a function you specify a function with a Param river.
You can have an empty pair with.
Or you can pass in something half past 10 m s t here will K which is a message in between this curly
braces.
Here this is the opaline and this is the closing on line 5 as closing curly braces.
In between is what the function will do.
So it's saying here what is saying here's that document.
Don't get element by the output.
Okay will this value here.
Did document a great element.
Hey.
Which is the hard part here.
Whatever we're typing here will output underneath here.
That's what I say.
Okay so documentor get element back Heidi which is output this output.
Here is an idea that was specified in the hastier mail which is this.
This is what is talking about this here on line 16.
Okay so how to get that Heidi and then replace the in a hasty mail which is mean.
Tim here in this case is blank.
There is no text there.
So easy to replace whatever is there with whatever you've typed in.
Okay so in this case I have to say for example what I typed in the word hell so it will replace whatever
is there with the helo.
I have typed in there.
Of came.
Plus the message that's that's whatever it will display this text relend is plus whatever a tight team.
So anything high typing is what this msee refers to here.
Okay so this word I typed in hello is what is talkin about.
Hello.
Here he is represented by his msee which is messy.
So it will now display.
Lent is what they're talking as an emissary which in my case in that example was.
Hello.
All right.
So that's what the function will do.
All right.
On line 7 here we've got another function here built in function Wackies documents.
And don't get elemen.
I mean the idea here is button which has been defined here.
Button.
Okay.
And this is text between the button.
K. So what it's saying is get that element by its idea.
And when you and they have attached to an event handler which is the dot on click is an event handler
which means because there's a button when the button is clicked.
This event happened like here will handle what will happen when the button is clicked.
That's what this click means is an event handler.
So when they click on this event handler will be equal do is function.
Here of course will function and then the event or the event.
In this case could be anything in the event here is an art click so it will pass in that event which
will be whatever's been typed in and it will then print documents get element I.D. this brinkema's Display
it to display documentor get limber.
The idea here is think it is a string.
If I go back to my highest email here this drink here refers to the input tag here so it will grab this
eidy and then determine the value of the left.
So this is how you determine the lente value of a word dot value dot length.
Okay save it whatever string have passed send So if I pass in Hello It will determine the length of
that helo using this method.
Dot value don't float.
This is what determines the length of the word.
Okay so this is how you would implement the javascript responsible for determining the word lentzsch
you type into an input box.
If I save this now save or go back to a document if I refresh this and type typing fair typing in VAX
angle kochel it tells me the lentzsch is 6 so you can see the application is now working correctly.
Now that we've implemented a javascript court that's sit for this lecture.
So in this section we have successfully created an app that we can use to cackle late length off word.
Thanks for much for watching.
Please let me know if you have any questions or are there any aspects of the project you do not understand.
Be more than happy to help.
Thank you.
Bye for now.